<template lang="">
	<div class="row">
		<h2 class="" style="font-size:13px;margin-left:5px">带量完成情况</h2>
	</div>
  <div class="drug_datalist">
	<el-table :data="tableData" style="width: 600px;font-size:10px">
    <el-table-column prop="name" label="医院名" width="180" id="bar_row" />
    <el-table-column prop="edu" label="采购任务额度" width="180" id="bar_row" />
    <el-table-column prop="over" label="完成量" id="bar_row" >
			<template #default="scope">
                 <el-progress
                   type="line"
                   :stroke-width="5"
                   :percentage="scope.row.progress"
                   :color="blue"
                   style="font-size:10px"
                 ></el-progress>
               </template>
		</el-table-column>
  </el-table>
  </div>
</template>
<script>
export default {
  name: "dashboard",
  components: {
  },
  data() {
    return {
      tableData: [{
        edu: '200w',
        name: '永嘉县人民医院',
        progress: '13',
      },
      {
        edu: '400w',
        name: '温州市中心医院',
        progress: '23',
      }]
    }

  },
  created() {
  },
  mounted() {

  },
  methods: {
  }
}
</script>
<style>
#multipleBar3 {
  margin: 0;
  padding: 0;
}

.flex {
  display: flex;
}

.col {
  flex-direction: column;
}

#bar_row {
  height: 30px;
}

.el-table__row {
  height: 60px;
}

bady {
  margin: 0;
}

.list_title1 {
  /* background-color: #383d53; */
  color: #fff;
  padding: 8px 2px;
  border-radius: 4px;
  /* // border-left: 5px solid var(--divor-primary-light-5); */
  height: 20px;
  line-height: 20px;
  margin-top: 10px;
}

#multipleBar3 {
  /* background-color: #2f3243; */
  padding: 8px 2px;
  border-radius: 6px;
  /* // border-left: 5px solid var(--divor-primary); */
  height: 170px;
  line-height: 10px;
}

.title_data {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  height: 130px;
}

.table-name {
  font-size: 25px;
  color: rgb(236, 240, 245);
}

.left_data {
  font-size: 5px;
  color: #ffffffba;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  margin-top: 20px;
  height: 100px;
  /* // line-height: 100px; */
  /* // background-color: #ffffff45; */
  width: 250px;
}

.right_data {
  font-size: 5px;
  color: #ffffffba;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  margin-top: 20px;
  height: 100px;
  /* // line-height: 100px; */
  /* // background-color: #ffffff45; */
  width: 250px;
}

.numberdata {
  background-image: linear-gradient(to top, #5699e661, #69a8e6);
  margin-left: 5px;
  border-radius: 5px;
}

.drug_datalist {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 180px;
}
</style>
